<template>
  <blockquote :class="blockquoteClass">
    <div class="axiom-blockquote__content">
      <slot />
    </div>
    <div v-if="author" class="axiom-blockquote__author">
      {{ author }}
    </div>
    <div v-else-if="$slots.author" class="axiom-blockquote__author">
      <slot name="author" />
    </div>
  </blockquote>
</template>

<script>
import { computed } from 'vue'
// // import { GlobalUtilsMixin } from '@/utils/globalUtils';

export default {
  name: 'AxiomBlockquote',
  // // mixins: [GlobalUtilsMixin],
  props: {
    // 作者名称
    author: {
      type: String,
      default: ''
    },
    // 引用类型
    type: {
      type: String,
      default: 'default',
      validator: (value) => ['default', 'success', 'warning', 'danger', 'info'].includes(value)
    }
  },
  computed: {
    // 计算样式类
    blockquoteClass() {
      const classes = ['axiom-blockquote']
      
      if (this.type !== 'default') {
        classes.push(`axiom-blockquote--${this.type}`)
      }
      
      return classes.join(' ')
    }
  },
  created() {
    // 记录组件初始化
    // this.$logger.debug('CBlockquote 组件初始化', {
    //   author: this.author,
    //   type: this.type
    // });
  }
}
</script>

<style lang="scss">
@use '../../styles/components/common/axiom-blockquote';
</style> 